<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<title></title>
		<script src="js/rem.js"></script>
		<script type="text/javascript" src="js/touth.js"></script>
		<script type="text/javascript" src="js/iscroll.js"></script>
		<script type="text/javascript">
			var myscroll;
			function loaded(){
				setTimeout(function(){
					myscorll = new iScroll('wrapper',{
						hScroll:true,
						vScroll:true,
						hScrollbar:false,
						vScrollbar:false
					});
				},100)
			}
			window.addEventListener('load',loaded,false);
		</script>
		<script type="text/javascript" src="js/jquery-1.11.0.js"></script>
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<link rel="stylesheet" type="text/css" href="css/reset.css"/>
		<link rel="stylesheet" href="css/common.css" />
		<link rel="stylesheet" type="text/css" href="css/index.css"/>
		<link rel="stylesheet" type="text/css" href="css/iconfont.css"/>
	</head>
	<body>
		<header>
			<ul class="tabbox">
				<li class="active">热点</li>
				<a href="index_1.html"><li>关注</li></a>
				<div class="clb"></div>
			</ul>
		</header>
		<ul class="nav">
			<li><a class="active" href="###">足球现场</a></li>
			<li><a href="###">足球生活</a></li>
			<li><a href="###">足球美女</a></li>
		</ul>
		<div class="main" id="wrapper">
			<div class="contain" id="scroller">
				<!-- 足球现场  -->
				<div class="zq_scene"id="scene" >
					<ul id="ullist" class="ul_list">
						<li></li>
						<li></li>
					</ul>
					<script type="text/javascript">
					picLoad(1);
					$(".nav li").click(function(){
						var ind = $(this).index() + 1;
						 picLoad(ind);
					});
					function picLoad(ind){
						var oUl = document.getElementById("ullist");
						var oLi = oUl.getElementsByTagName("li");
						$("#ullist li").html("");
						$.ajax({
							type:"get",
							url:"http://localhost:8080/Proxy/FootBall/tweet/json/query/hotspot.do",
							async:true,
							data:{
								"category":ind
							},
							success:function(rsp){
								//console.log(rsp);
								var rsp = JSON.parse(rsp);
								var str = "";
								for(var i = 0; i < rsp.data.tweetlist.length; i++){
									str = '<dl><dt><img src="http://101.200.173.217:8080/FootBall' + rsp.data.tweetlist[i].defaultFilePath + rsp.data.tweetlist[i].thumbnailname +'" alt="" /></dt><dd>' + rsp.data.tweetlist[i].content +'</dd></dl>'
									oLi[compare()].innerHTML += str;
								}
								
								function compare(){
									var index = 0;
									var min = oLi[index].offsetHeight;
									for(var i= 0; i < oLi.length; i ++){
										if(oLi[i].offsetHeight < min ){
											index = i;
											min = oLi[index].offsetHeight;
										}
									}
									return index;
								}
								
							}
						});
					}
					</script>
					<div class="clb"></div>
				</div>
			
			</div>
		</div>
		
		<!-- 尾部 -->
		<footer id="foot">
			<img class="cream" src="img/cream.png" alt="" />
			<div class="bottomleft">
				<a href="index.html">
					<dl>
						<dt><i class="iconfont active">&#xe65c;</i></dt>
						<dd class="quickseltxt active">首页</dd>
					</dl>
				</a>
				<a href="search.html">
					<dl>
						<dt><i class="iconfont">&#xe669;</i></dt>
						<dd class="quickseltxt">发现</dd>
					</dl>
				</a>
			</div>
			<div class="bottomright">
				<a href="user.html">
					<dl>
						<dt><i class="iconfont">&#xe674;</i></dt>
						<dd class="quickseltxt">我的</dd>
					</dl>
				</a>
				<a href="index.html">
					<dl>
						<dt><i class="iconfont">&#xe644;</i></dt>
						<dd class="quickseltxt">退出</dd>
					</dl>
				</a>
			</div>
		</footer>
	</body>
	
</html>
